<!--  -->
<template>
  <div>
      <div class="footer">
          <div class="footer_nav">
              <ul>
                  <li>
                      <i class="iconfont">&#xe63b;</i>
                      <span>机票</span>
                  </li>
                  <li>
                      <i class="iconfont">&#xe619;</i>
                      <span>酒店</span>
                  </li>
                  <li>
                      <i class="iconfont">&#xe618;</i>
                      <span>公寓</span>
                  </li>
                  <li class="gengduo">
                      <i class="iconfont">&#xe630;</i>
                      <span>更多</span>
                  </li>
              </ul>
          </div>
        <div class="footer_navtwo">
            <ul>
                <li><a href="">登录</a></li>
                <li><a href="">我的订单</a></li>
                <li><a href="">最近浏览</a></li>
                <li><a href="">关于我们</a></li>
            </ul>
        </div>
        <div class="footer_text">
            <div class="text1">
                <span class="s1">触屏版</span>
                <span class="s2">电脑版</span>
            </div>
            <div class="text2">
                Qunar 京ICP备05021087意见反馈
            </div>
        </div>
      </div>
  </div>
</template>

<script>
export default {
  data () {
    return {
    };
  },
}

</script>
<style scoped="" lang="scss">
.footer_text{
    width: 100%;
    height: 1.33333rem;
    font-size: 0.3777777rem;
    .text1{
        display: flex;
        height: 30px;
        justify-content: center;
        align-items: center;
        .s1{
            color: #000;
            margin-right: 20px;
        }
        .s2{
            color: #25a4bb;
        }
        
    }
    .text2{
        text-align: center;
        color: #9e9e9e;
    }
    
}
.gengduo{
    font-size: 12px;
    border-left: solid 1px #acacac;
    i{
        margin-left: 10px;
        font-size: 12px;
    }
}
.footer{
    width: 100%;
    height: auto;
    background: #f6f3f3;
    .footer_nav{
        width: 100%;
        height: 0.93333333rem;
        ul{
            width: 100%;
            height: 100%;
            display: flex;
            justify-content:center;
            align-items: center;
            li{
                width: 20%;
                font-size: 0.3777777rem;
                color: #9e9e9e;
            }
        }
    }
}
.footer_navtwo{
    width: 100%;
    height: 1.0666666rem;
    border-bottom: solid 1px #cacaca;
    ul{
        width: 100%;
        height: 100%;
        display: flex;
        li{
            width: 25%;
            display: flex;
            justify-content: center;
            align-items: center;
            a{
                font-size: 0.3777777rem;
                color: #25a4bb;
                text-decoration: none;
            }
        }
    }
}
</style>